<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <title>Document</title>
  </head>

  <body>
    <script>
        //第一步：创建XMLHttpReques对象
        var ajax = new XMLHttpRequest();

        //第二步：创建链接
        ajax.open("get", "https://cnodejs.org/api/v1/topics?page=2&limit=10", true);
      
        //第三步：接受响应执行回调函数——当状态改变时自动触发该函数
        ajax.onreadystatechange = function () {
            if (ajax.readyState == 4 && ajax.status == 200) { //接收完数据，且数据相应成功
                var txt = ajax.responseText;
                console.log(typeof txt,txt);
                // var data = JSON.parse(txt); //json数据解析为js对象
                //console.log(typeof data);

                //其他DOM操作
            }
        }

        //第四步：发送请求
        ajax.send(null);
        //ajax.send("key1=value1&key2=value2");//POST请求通过send发送数据，GET请求在URL上体现数据
    </script>
    <div></div>
  </body>
</html>
